<template>
    <!-- 情感分析 -->
    <view class='emotion_box'>
        <pie 
            :width='charts_width' 
            :pie_data='pie_data'
            :legend_show="true"
            :dataLabel="true"
            :id='"emotion_pie"'></pie>
    </view>
</template>

<script>

    import pie from './charts/pie.vue'

    export default {
        components: {
            pie
        },
        props: {
            content: Array,
        },
        data() {
            return {
                color: ["#2ECC71","#FFCC11","#FF698D"],
                charts_width: 0,
                pie_data: [],
                name(sen) {
                    switch(sen) {
                        case "0":
                            return "中性"
                        break;
                        case "1":
                            return "正面"
                        break;
                        case "-1":
                            return "负面"
                        break;
                    }
                }
            }
        },
        async mounted() {
            this.content.forEach((val,i) => {
                let obj = {
                    name: this.name(val.sen),
                    data: val.count,
                    color: this.color[i]
                }
                this.pie_data.push(obj)
            });
           this.charts_width = await this.$getDomInfo(".charts_box","width");
        }
    }
</script>

<style lang="scss" scoped>
.emotion_box {
    width: 100%;
}
</style>